import React, {PureComponent} from 'react';

import NavigationFactory from '../utils/NavigationFactory';
import SplashScreen from 'react-native-splash-screen';

import {observer, inject} from 'mobx-react';
import {StyleSheet, View, Button} from 'react-native';
import {Text} from 'react-native-paper';

import styles from '../styles/CommonStyles';

@NavigationFactory
@inject('userModel')
@observer
class HomePage extends PureComponent {
  componentDidMount() {
    //模拟数据到
    this.timer = setTimeout(() => {
      SplashScreen.hide();
    }, 2000);
  }

  componentWillUnmount() {
    this.timer && clearTimeout(this.timer);
  }

  constructor(props) {
    super(props);
    this.state = {};
    this.userModel = this.props.userModel;
  }

  render() {
    return (
      <View style={styles.Centered}>
          <Text style={styles.text}>{this.userModel.num}</Text>
          <Text style={styles.text}>{this.userModel.userInfo.name}</Text>
          <Text style={styles.text}>{this.userModel.userInfo.age}</Text>
        <Button
          onPress={() => {
            this.userModel.updateUser({name:"星華",age: 10});
          }}
          title="d点击我"
        />
      </View>
    );
  }
}

// const styles = StyleSheet.create({
//   contain: {
//     flex: 1,
//     justifyContent: 'center',
//     alignItems: 'center',
//   },
// });

export default HomePage;
